import * as React from 'react';
import ErrorChart from '../../component/home-error-chart';
import AllProjectsOverView from '../../component/home-all-overview';
import ErrorRateChart from '../../component/home-error-rate-chart';
import PvChart from '../../component/pv-chart';
import api from '../../common/api';
import './index.less';
import moment from 'moment';
import HomeErrorCharts from '../../component/home-error-chart';
const { useEffect, useState } = React;
/**
 * 页面 Container
 */
export default function Home() {
    const [overview, setOverview] = useState({
        overview1: [],
        overview2: []
    });
    const [projectList, setProjectList] = useState([]);
    const [loading, setLoading] = useState(true);
    useEffect(() => {
        const fetchDate = async () => {
            const data = await api.get(`//${location.host}/controller/userAction/getBusiness.do`) as any;
            setProjectList(data.item);
            const ids = data.item.map(project => project.id);
            const req = (deltaDate: number) => api({
                method: 'GET',
                url: '/controller/statisticsAction/getRate.do',
                params: {
                    badjsid: ids.join(','),
                    date: moment().add(deltaDate, 'days').format("YYYY-MM-DD")
                }
            }) as any;
            const [overview1, overview2] = await Promise.all([req(-1), req(-2)]) as any;
            setOverview({
                overview1: overview1,
                overview2: overview2
            });
            setLoading(false);
        };
        fetchDate();
    }, [])
    return (
        <div>
            <AllProjectsOverView overview={overview} loading={loading}></AllProjectsOverView>
            <ErrorRateChart loading={loading} overview={overview} projectList={projectList} ></ErrorRateChart>
            <PvChart loading={loading} overview={overview} projectList={projectList} ></PvChart>
            <HomeErrorCharts loading={loading} projectList={projectList}></HomeErrorCharts>
        </div>
    );
}

